<template>
    <n-space vertical>
        <n-space align="center">
            <n-icon size="24">
                <svg-icon name="time" />
            </n-icon>
            {{ currentTime }}
        </n-space>

        <n-space>
            当前会议：{{ roomId }}
        </n-space>
    </n-space>


</template>

<script setup>
import { ref, computed, onMounted, onUnmounted } from 'vue'
import moment from "moment";
import {useStore} from 'vuex'

const store = useStore();
const currentTime = ref(moment().format('MM月DD日 HH:mm:ss'));
const timer = ref(0)

const roomId = computed(() => {
    return store.state.meeting.roomId
})

onMounted(() => {
    timer.value = setInterval(() => {
        currentTime.value = moment().format('MM月DD日 HH:mm:ss')
    }, 1000);
})
onUnmounted(() => {
    clearInterval(timer.value)
})
</script>
<style lang="scss" scoped>
</style>